<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:p="http://primefaces.org/ui"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:pe="http://primefaces.org/ui/extensions">
    <h:head>
        <title>#{bundle.branch}</title>
        <link href="./resources/css/default.css" rel="stylesheet" type="text/css" />
    </h:head>
    <h:body>
        <ui:composition>
            
        <h:form >

           <script type="text/javascript">  
                function handleSaveBranch(xhr, status, args) {  
                    if(args.validationFailed || !args.success) {  
                        jQuery('#dialog').effect("shake", { times:3 }, 100);  
                    } else {  
                        dlgBranch.hide();  
                    }  
                }
                
                function handleDeleteBranch(xhr, status, args) {  
                    if(args.validationFailed || !args.success) {  
                        jQuery('#dialog').effect("shake", { times:3 }, 100);  
                    } else {  
                        dlgConfirmation.hide();  
                    }  
                }
                
            </script>  

            <p:toolbar>
                <p:toolbarGroup align="left">
                    <p:commandButton value="#{bundle.btnNew}"
                                     image="ui-icon-document"  rendered="#{menuBean.cekButtonAccess(606,'INS;')}"
                                     action="#{branchBean.newData()}"  
                                     oncomplete="dlgBranch.show()"
                                     update=":#{utilityBean.findClientId('displayBranch')}"> 
                    </p:commandButton>

                    <p:commandButton value="#{bundle.btnOpen}" oncomplete="dlgBranch.show()"
                                     action="#{branchBean.openData()}"   rendered="#{menuBean.cekButtonAccess(606,'OPN;')}"
                                     image="ui-icon-disk" 
                                     update=":#{utilityBean.findClientId('displayBranch')}" > 
                    </p:commandButton>

                    <p:commandButton value="#{bundle.btnDelete}" image="ui-icon-trash"
					 rendered="#{menuBean.cekButtonAccess(606,'DEL;')}"
                                     onclick="dlgConfirmation.show()" /> 

                   <!-- <p:commandButton type="push" value="#{bundle.btnPrint}" image="ui-icon-print"/> -->
                </p:toolbarGroup>
            </p:toolbar>
            <br />
            <p:dataTable var="branch" value="#{branchBean.branchs}" id="dtbranchs" sortBy="#{branch.branchNo}"
                         selection="#{branchBean.selectedData}" selectionMode="single" rowKey="#{branch.branchId}" 
                         paginator="true" rows="10" paginatorPosition="bottom" 
                         paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
                         rowsPerPageTemplate="5,10,15,30">
                <p:column rendered="false">
                    <f:facet name="header">ID</f:facet>
                    <h:outputText value="#{branch.branchId}" />
                </p:column>
                <p:column style="width: auto" sortBy="#{branch.branchNo}">
                    <f:facet name="header">#{bundle.branchNo}</f:facet>
                    <h:outputText value="#{branch.branchNo}" />
                </p:column>
                <p:column style="width: auto" sortBy="#{branch.branchName}">
                    <f:facet name="header">#{bundle.globalName}</f:facet>
                    <h:outputText value="#{branch.branchName}" />
                </p:column>

                <p:column style="width: auto" sortBy="#{branch.addressLine1}">
                    <f:facet name="header">#{bundle.adress}</f:facet>
                    <h:outputText value="#{branch.addressLine1}" />
                </p:column>

                <p:column style="width: auto">
                    <f:facet name="header">#{bundle.phone}</f:facet>
                    <h:outputText value="#{branch.phone}" />
                </p:column>

                <p:column style="width: auto">
                    <f:facet name="header">#{bundle.fax}</f:facet>
                    <h:outputText value="#{branch.fax}" />
                </p:column>
            </p:dataTable>      
            
            <p:confirmDialog message="#{bundle.confirmDelete}" 
                             header="#{bundle.confirmDeleteHeader}" severity="alert" widgetVar="dlgConfirmation">
                <h:panelGrid cellspacing="0" cellpadding="0" styleClass="pComBtnD">
                    <f:facet name="footer">
                        <p:commandButton value="#{bundle.btnYes}" update="dtbranchs" process="@this"
                                         oncomplete="handleDeleteBranch(xhr, status, args)"  
                                         actionListener="#{branchBean.delete()}" />  
                        <p:commandButton value="#{bundle.btnCancel}" onclick="dlgConfirmation.hide()" type="button" />  
                    </f:facet>
                </h:panelGrid>
            </p:confirmDialog>
        </h:form>

        <p:dialog header="#{bundle.branch}" widgetVar="dlgBranch" closable="true" dynamic="true" modal="true" appendToBody="true">
            <p:ajax event="close" listener="#{branchBean.handleClose}"/>
            <h:form>
                <h:panelGrid style="vertical-align: top" id="displayBranch" styleClass="addELIT" cellpadding="0" columns="2" columnClasses="panelGridId,panelGridId">
                <p:panel header="#{bundle.branch}" style="margin: 0 0 0 0;">
                    <h:panelGrid  style="vertical-align: top" columns="3" cellpadding="0" cellspacing="5">
                        <h:outputLabel value= "#{bundle.branchNo}" /><h:outputLabel value= ":" />
                        <p:inputText rendered="#{branchBean.insertedData!=null}" value="#{branchBean.insertedData.branchNo}" size="25" />  

                        <h:outputLabel value= "#{bundle.globalName}" /><h:outputLabel value= ":" />
                        <p:inputText rendered="#{branchBean.insertedData!=null}" value="#{branchBean.insertedData.branchName}" size="25" />  

                        <h:outputLabel value= "#{bundle.adress}" /><h:outputLabel value= ":" />
                        <p:inputText size="50" rendered="#{branchBean.insertedData!=null}" value="#{branchBean.insertedData.addressLine1}" />  

                        <h:outputLabel value= " " /><h:outputLabel value= " " />
                        <p:inputText size="50" rendered="#{branchBean.insertedData!=null}" value="#{branchBean.insertedData.addressLine2}" />  
                        
                        <h:outputLabel value= " " /><h:outputLabel value= " " />
                        <p:inputText size="50" rendered="#{branchBean.insertedData!=null}" value="#{branchBean.insertedData.addressLine3}" />  

                        <h:outputLabel value= "#{bundle.phone}" /><h:outputLabel value= ":" />
                        <p:inputText rendered="#{branchBean.insertedData!=null}" value="#{branchBean.insertedData.phone}" size="25" />  

                        <h:outputLabel value= "#{bundle.fax}" /><h:outputLabel value= ":" />
                        <p:inputText rendered="#{branchBean.insertedData!=null}" value="#{branchBean.insertedData.fax}" size="25" />  
                    </h:panelGrid>
                </p:panel>
                    
                <p:panel header="CLIENT">
                    <pe:masterDetail id="branchMD" selectLevelListener="#{selectLevelListener.handleNavigation}" style="width: 400px;">
                        <pe:masterDetailLevel level="1" levelLabel="CLIENT">
                            <p:outputPanel autoUpdate="true">
                                <p:dataTable id="dtBranchPcs" var="pcs" value="#{branchBean.insertedData.branchPcs}" rowIndexVar="noUrut2"
                                                 rendered="#{branchBean.insertedData != null}">
                                    <p:column style="width: 11px;">
                                        <f:facet name="header">No</f:facet>
                                        <h:outputText value="#{noUrut2+1}" styleClass="numPos" >
                                            <f:convertNumber groupingUsed="true"/>
                                        </h:outputText>
                                    </p:column>
                                            
                                    <p:column style="width: 80px;">
                                        <f:facet name="header">IP Address</f:facet>
                                        <h:outputText value="#{pcs.ipAddress}" />
                                    </p:column>
                                        
                                    <p:column style="width: 80px;">
                                        <f:facet name="header">MAC Address</f:facet>
                                        <h:outputText value="#{pcs.macAddress}" />
                                    </p:column>

                                    <p:column style="width:80px">
                                        <f:facet name="header">Actions</f:facet>
                                                <p:commandLink value="Add" actionListener="#{branchBean.newDetail()}" >
                                                <pe:selectDetailLevel contextValue="#{null}" preserveInputs="true"/>
                                        </p:commandLink><p:spacer width="3"/>

                                        <p:commandLink value="Edit" actionListener="#{branchBean.editDetail(pcs)}" disabled="#{pcs.ipAddress==null}">
                                                <pe:selectDetailLevel contextValue="#{pcs}" preserveInputs="true"/>
                                        </p:commandLink><p:spacer width="3"/>

                                        <p:commandLink value="Del" actionListener="#{branchBean.handleRemoveRow()}" disabled="#{pcs.ipAddress==null}">
                                            <p:collector value="#{pcs}" removeFrom="#{branchBean.insertedData.branchPcs}" />  
                                        </p:commandLink>
                                    </p:column>
                                </p:dataTable>
                            </p:outputPanel>
                        </pe:masterDetailLevel>
                                
                        <pe:masterDetailLevel level="2" levelLabel="Add/edit" contextVar="pcs" >
                            <h:panelGrid id="frmEditClient" columns="3" border="0" cellpadding="0" cellspacing="5" >
                                <h:outputLabel value= "IP Address" /><h:outputLabel value=":"/>
                                <h:panelGrid columns="2" cellpadding="0" cellspacing="0">
                                    <p:inputText value="#{branchBean.unsaveIP.ipAddress}" style="width: 150px;"
                                                 id="clientIpAddress" required="true" label="IP Address"
                                        requiredMessage="IP Address #{bundle.requiredInput}">
                                        <p:ajax event="blur" update="msgclientIpAddress" process="@this" /> 
                                    </p:inputText>
                                    <p:message id="msgclientIpAddress" for="clientIpAddress" display="icon" />
                                </h:panelGrid>

                                <h:outputLabel value= "MAC Address" /><h:outputLabel value=":"/>
                                <h:panelGrid columns="2" cellpadding="0" cellspacing="0">
                                    <p:inputText value="#{branchBean.unsaveIP.macAddress}" style="width: 150px;" 
                                                 id="clientMacAddress" label="MAC Address" 
                                        requiredMessage="MAC Address #{bundle.requiredInput}">
                                        <p:ajax update="msgclientMacAddress" process="@this" /> 
                                    </p:inputText>
                                    <p:message id="msgclientMacAddress" for="clientMacAddress" display="icon" />
                                </h:panelGrid>
                            </h:panelGrid>
                                    
                            <h:panelGrid cellpadding="0" >
                                <f:facet name="footer">  
                                    <p:commandButton value="Back" icon="ui-icon ui-icon-arrowthick-1-w" process="@this" >
                                        <pe:resetEditableValues for="frmEditClient"/>  
                                        <pe:selectDetailLevel step="-1"/>
                                    </p:commandButton>
                                            
                                    <p:commandButton value="#{bundle.btnSave}" icon="ui-icon-disk"
									
									actionListener="#{branchBean.saveDetail()}"/>
                                            
                                    <p:commandButton value="#{bundle.btnNew}" icon="ui-icon-document" actionListener="#{branchBean.newDetail()}"
                                                     process="@this" update="frmEditClient">
                                        <pe:resetEditableValues for="frmEditClient"/>  
                                    </p:commandButton>  
                                            
                                </f:facet>
                            </h:panelGrid>

                        </pe:masterDetailLevel>
                    </pe:masterDetail>


                </p:panel>

            </h:panelGrid>

            <h:panelGrid cellpadding="0" styleClass="pComBtnSTDR">
                <f:facet name="footer">
                    <p:commandButton value="#{bundle.btnSave}" image="ui-icon-disk" action="#{branchBean.trySave()}"
                                     update=":#{utilityBean.findClientId('dtbranchs')}"
									  rendered="#{menuBean.cekButtonAccess(606,'UPD;')}"
                                     oncomplete="handleSaveBranch(xhr, status, args)"/>
                    <p:commandButton value="#{bundle.btnClose}" oncomplete="dlgBranch.hide()" image="ui-icon-document"/>
                </f:facet>
            </h:panelGrid>
            </h:form>
        </p:dialog>
        
        </ui:composition>    
    </h:body>
</html>